// 登录模态框
window.addEventListener("load", () => {
    //获取开启按钮，登录框
    const openLoginBox = document.querySelector(".user")
    //关闭
    const closeLoginBox = document.querySelector(".login_model_box_close")
    const loginModelBox = document.querySelector(".login_model_box")

    //打开功能
    openLoginBox.addEventListener("click", () => {
        if (token) {
            window.open("personal_detail.html")
        }
        else {
            loginModelBox.style.display = "block"
        }

    })
    //关闭
    closeLoginBox.addEventListener("click", () => {
        loginModelBox.style.display = "none"
    })
})

//模态框内登录注册切换
const login = document.querySelector(".login")
const register = document.querySelector(".register")
const toLogin = document.querySelector(".to_login")
const toRegister = document.querySelector(".to_register")
// document.querySelector(".to_login").addEventListener("click", function () {
toLogin.addEventListener("click", function () {
    login.style.display = "block"
    register.style.display = "none"
    console.log('1')
})
toRegister.addEventListener("click", function () {
    login.style.display = "none"
    register.style.display = "block"
    console.log('2')
})


let token
// register
const registerBtn = document.querySelector(".login_model_box_submit_register")
//需要修改button的type，防止提交自动刷新页面，数据丢失
registerBtn.addEventListener("click", () => {
    //点击后再获取，否则页面一加载就获取了，是空值
    const registerUsername = document.querySelector(".register_username").value
    const registerPassword = document.querySelector(".register_password").value
    const xhr = new XMLHttpRequest()
    // 准备提交的数据
    xhr.open('POST', `https://blog.zifeiyu.love/user/register?username=${registerUsername}&password=${registerPassword}`)
    //设置请求头
    xhr.setRequestHeader('Content-Type', 'application/json')
    //设置请求体，发起请求
    xhr.send()
    xhr.addEventListener("readystatechange", function () {
        if (this.readyState === 4) {
            console.log(this.responseText);
        }
    })
})

// login
const loginBtn = document.querySelector(".login_model_box_submit_login")
loginBtn.addEventListener("click", () => {
    const loginUsername = document.querySelector(".login_username").value
    const loginPassword = document.querySelector(".login_password").value
    const xhr = new XMLHttpRequest()
    xhr.responseType = 'json'
    xhr.open('GET', `https://blog.zifeiyu.love/user/login?username=${loginUsername}&password=${loginPassword}`)
    xhr.send()
    xhr.addEventListener("readystatechange", function () {
        if (this.readyState === 4) {
            console.log(this.response);
            document.querySelector(".login_model_box").style.display = "none"
            localStorage.setItem("token", this.response.data.tokenValue)
            // token = JSON.parse(localStorage.getItem("token"))   //简单数据类型不需要转换成json格式
            token = (localStorage.getItem("token"))
            document.querySelector(".user_icon").src = "images/user_login_icon.png"
            document.querySelector(".user-droplist").style.opacity = "0"
            console.log(token)
        }
    })
})




// xhr.setRequestHeader("token", "");
// xhr.setRequestHeader("User-Agent", "Apifox/1.0.0 (https://apifox.com)");




// 失败的注册案例..........................................................
//需要修改button的type，防止提交自动刷新页面，数据丢失
// registerBtn.addEventListener("click", () => {
//     //点击后再获取，否则页面一加载就获取了，是空值
//     const registerUsername = document.querySelector(".register_username").value
//     const registerPassword = document.querySelector(".register_password").value
//     const xhr = new XMLHttpRequest()
//     xhr.open('POST', `https://blog.zifeiyu.love/user/register?username=${registerUsername}&password=${registerPassword}`)
//     //设置请求头
//     xhr.setRequestHeader('Content-Type', 'application/json')
//     // // 准备提交的数据
//     // // console.log(registerPassword)
//     // // console.log(registerUsername)
//     // // const userObj = {
//     // //     username: registerUsername,     //为什么不能传变量的值啊啊啊啊啊啊啊啊啊啊！！！！！！！！！！！！
//     // //     password: registerPassword
//     // // }
//     // // const userStr = JSON.stringify(userObj)
//     // // console.log(userStr)

//     //设置请求体，发起请求
//     // xhr.send(userStr)
//     xhr.send()
//     xhr.addEventListener("readystatechange", function () {
//         if (this.readyState === 4) {
//             console.log(this.responseText);
//         }
//     });
//     // xhr.addEventListener('loadend', () => {
//     //     console.log(xhr.response)
//     // })
// })


// let registerUsername = document.querySelector(".register_username").value
// let registerPassword = document.querySelector(".register_password").value
// registerBtn.addEventListener("click", () => {
//     axios({
//         url: 'https://blog.zifeiyu.love/user/register?username&password',
//         method: 'POST',
//         data: {
//             username: registerUsername,
//             password: registerPassword
//         }
//     }).then((result) => {
//         console.log(result)
//     })
// .then(function (response) {
//     console.log(response);
//     console.log(JSON.stringify(response.data));
// }).catch(function (error) {
//     console.log(error);
// });
// })



// loginBtn.addEventListener("click", () => {
//     const loginUsername = document.querySelector(".login_username").value
//     const loginPassword = document.querySelector(".login_password").value
//     const xhr = new XMLHttpRequest()
//     xhr.open('GET', 'https://blog.zifeiyu.love/user/register')

//     //设置请求头
//     xhr.setRequestHeader('Content-Type', 'application/json')
//     //准备提交的数据
//     console.log(registerPassword)
//     console.log(registerUsername)
//     const userObj = {
//         username: registerUsername,
//         password: registerPassword
//     }
//     const userStr = JSON.stringify(userObj)
//     console.log(userStr)
//     //设置请求体，发起请求
//     xhr.send(userStr)
//     xhr.addEventListener('loadend', () => {
//         console.log(xhr.response)
//     })
//     xhr.addEventListener("error",get)
// })




// login
// const loginBtn = document.querySelector(".login_model_box_submit_login")
// const loginUsername = document.querySelector(".login_username").value
// const loginPassword = document.querySelector(".login_password").value
// loginBtn, addEventListener("click", () => {
//     axios({
//         // url: 'https://blog.zifeiyu.love/user/login?username&password',
//         url: 'https://blog.zifeiyu.love/user/login',
//         params: {
//             username: loginUsername,
//             password: loginPassword
//         }
//     }).then((result) => {
//         document.querySelector('.user img').src = ''
//         localStorage.setItem('token', result.data.tokenValue)
//     }).catch(() => {
//         alert("该用户不存在")
//     })
// })